<template>
  <div class="detail">
    <mu-appbar style="width: 100%;" color="primary">
      <mu-button icon slot="left" @click="() => this.$router.go(-1)">
        <mu-icon value="arrow_back"></mu-icon>
      </mu-button>成绩信息
    </mu-appbar>
    <div class="top-blank"></div>
    <mu-card>
      <mu-card-header :title="name" :sub-title="stuid"></mu-card-header>
      <mu-card-title title="主修专业信息"></mu-card-title>
      <div class="card-textview">{{`平均绩点(百分制): ${mainCourseScore.avrScore}`}}</div>
      <div class="card-textview">{{`应修学分: ${mainCourseScore.creditSum}`}}</div>
      <div class="card-textview">{{`已修学分: ${mainCourseScore.creditGottenSum}`}}</div>
      <div class="card-textview">{{`选修学分: ${mainCourseScore.creditOptional}`}}</div>
    </mu-card>
    <mu-card>
      <mu-card-header :title="name" :sub-title="stuid"></mu-card-header>
      <mu-card-title title="第二专业信息"></mu-card-title>
      <div class="card-textview">{{`平均绩点(百分制): ${secondaryCourseScore.avrScore}`}}</div>
      <div class="card-textview">{{`应修学分: ${secondaryCourseScore.creditSum}`}}</div>
      <div class="card-textview">{{`已修学分: ${secondaryCourseScore.creditGottenSum}`}}</div>
      <div class="card-textview">{{`选修学分: ${secondaryCourseScore.creditOptional}`}}</div>
    </mu-card>
    <mu-paper :z-depth="1" round>
      <mu-data-table stripe :columns="columns" :data="tableList" @sort-change="handleSortChange">
        <template slot="expand" slot-scope="prop">
          <div style="padding: 24px;">{{`学年/学期: ${prop.row.XNMC}/${prop.row.XQMC}`}}</div>
          <div style="padding: 24px;">{{`科目代号: ${prop.row.KCH}`}}</div>
          <div style="padding: 24px;">{{`成绩/学分: ${prop.row.CJ}/${prop.row.XF}`}}</div>
          <div style="padding: 24px;">{{`绩点: ${prop.row.JD}`}}</div>
          <div style="padding: 24px;">{{`课程性质: ${prop.row.KCXZ}`}}</div>
          <div style="padding: 24px;">{{`考试性质: ${prop.row.KSXZMC}`}}</div>
        </template>
        <template slot-scope="scope">
          <td>{{scope.row.KCMC}}</td>
          <td class="is-right">{{scope.row.BFZCJ}}</td>
        </template>
      </mu-data-table>
    </mu-paper>
  </div>
</template>

<script lang="ts">
import Vue from "vue";
import { Component, Prop } from "vue-property-decorator";
import { ResponseList, ResponseItem } from "@/views/Type.ts";

type sortkey = "BFZCJ";

@Component
export default class Detail extends Vue {
  @Prop({
    default: () => ({ code: 0, queryRes: [] })
  })
  list!: ResponseList;

  tableList: Array<ResponseItem> = [];
  columns = [
    { title: "科目名称", width: 200, name: "KCMC" },
    {
      title: "考试成绩",
      name: "BFZCJ",
      width: 126,
      align: "center",
      sortable: true
    }
  ];

  mainRequiredCourse: any = {};
  secondRequiredCourse: any = {};
  mainOptionalCourse: any = {};
  secondOptionalCourse: any = {};

  get name() {
    return this.tableList[0].XM;
  }

  get stuid() {
    return this.tableList[0].XH;
  }

  get mainCourseScore() {
    let sum1 = 0,
      sum2 = 0,
      sum3 = 0,
      sum4 = 0;
    let _mainRequiredCourse = this.mainRequiredCourse;
    let _mainOptionalCourse = this.mainOptionalCourse;
    for (let k in _mainRequiredCourse) {
      sum1 += _mainRequiredCourse[k]["test"] * _mainRequiredCourse[k]["credit"];
      sum2 += _mainRequiredCourse[k]["credit"];
      sum3 += sum1 / _mainRequiredCourse[k]["test"];
    }
    for (let k in _mainOptionalCourse) {
      if (
        _mainOptionalCourse[k].KCXZ === "公选课" ||
        _mainOptionalCourse[k].KCXZ === "选修课"
      )
        sum4 += _mainOptionalCourse[k]["credit"];
    }
    return {
      avrScore: Number(sum1 / sum2).toFixed(2),
      creditSum: Number(sum2).toFixed(2),
      creditGottenSum: Number(sum3).toFixed(2),
      creditOptional: Number(sum4).toFixed(2)
    };
  }

  get secondaryCourseScore() {
    let sum1 = 0,
      sum2 = 0,
      sum3 = 0,
      sum4 = 0;
    let _secondRequiredCourse = this.secondRequiredCourse;
    let _secondOptionalCourse = this.secondOptionalCourse;
    for (let k in _secondRequiredCourse) {
      sum1 +=
        _secondRequiredCourse[k]["test"] * _secondRequiredCourse[k]["credit"];
      sum2 += _secondRequiredCourse[k]["credit"];
      sum3 += sum1 / _secondRequiredCourse[k]["test"];
    }
    for (let k in _secondOptionalCourse) {
      if (
        _secondOptionalCourse[k].KCXZ === "公选课" ||
        _secondOptionalCourse[k].KCXZ === "选修课"
      )
        sum4 += _secondOptionalCourse[k]["credit"];
    }
    return {
      avrScore: Number(sum1 / sum2).toFixed(2),
      creditSum: Number(sum2).toFixed(2),
      creditGottenSum: Number(sum3).toFixed(2),
      creditOptional: Number(sum4).toFixed(2)
    };
  }

  handleSortChange({ name, order }: { name: sortkey; order: string }) {
    this.tableList = this.tableList.sort((a, b) =>
      order === "asc" ? a[name] - b[name] : b[name] - a[name]
    );
  }

  mounted() {
    this.tableList = this.list.queryRes;
    let _res = this.tableList;
    let _mainRequiredCourse: any = {};
    let _secondRequiredCourse: any = {};
    let _mainOptionalCourse: any = {};
    let _secondOptionalCourse: any = {};
    _res.forEach(v => {
      if (v.KCBJ === "0")
        if (
          v.KCXZ !== "公选课" &&
          v.KCXZ !== "创新创业课" &&
          v.KCXZ !== "选修课"
        ) {
          if (
            _mainRequiredCourse[v.KCH] === undefined ||
            _mainRequiredCourse[v.KCH]["test"] < v.BFZCJ
          )
            _mainRequiredCourse[v.KCH] = {
              test: v.BFZCJ >= 60 ? v.BFZCJ : 0,
              credit: parseFloat(v.XF)
            };
        } else {
          if (
            _mainOptionalCourse[v.KCH] === undefined ||
            _mainOptionalCourse[v.KCH]["test"] < v.BFZCJ
          )
            _mainOptionalCourse[v.KCH] = {
              test: v.BFZCJ >= 60 ? v.BFZCJ : 0,
              credit: parseFloat(v.XF)
            };
        }
      else if (
        v.KCXZ !== "公选课" &&
        v.KCXZ !== "创新创业课" &&
        v.KCXZ !== "选修课"
      ) {
        if (
          _secondRequiredCourse[v.KCH] === undefined ||
          _secondRequiredCourse[v.KCH]["test"] < v.BFZCJ
        )
          _secondRequiredCourse[v.KCH] = {
            test: v.BFZCJ >= 60 ? v.BFZCJ : 0,
            credit: parseFloat(v.XF)
          };
      } else {
        if (
          _secondOptionalCourse[v.KCH] === undefined ||
          _secondOptionalCourse[v.KCH]["test"] < v.BFZCJ
        )
          _secondOptionalCourse[v.KCH] = {
            test: v.BFZCJ >= 60 ? v.BFZCJ : 0,
            credit: parseFloat(v.XF)
          };
      }
    });
    this.mainRequiredCourse = _mainRequiredCourse;
    this.mainOptionalCourse = _mainOptionalCourse;
    this.secondRequiredCourse = _secondRequiredCourse;
    this.secondOptionalCourse = _secondOptionalCourse;
  }
}
</script>

<style scoped>
.mu-appbar {
  height: 10vh;
  widows: 100%;
  position: fixed;
  top: 0;
  left: 0px;
}

.top-blank {
  height: 10vh;
  width: 100%;
}
</style>
